import { defineStore } from 'pinia'
import { ref } from 'vue'
import { getMenuPermission, type MenuPermissionItem } from '@/api/permission'
import { useStore } from './userInfo'
import router from '@/router'

/**
 * 菜单状态管理
 * 
 * 功能：
 * 1. 从后端获取完整的菜单权限树
 * 2. 根据路由meta中的roles判断用户是否有权限查看
 * 3. 过滤掉用户无权访问的菜单
 */
export const useMenuStore = defineStore('menu', () => {
  // 菜单数据 - 后端返回的完整菜单树
  const menuList = ref<MenuPermissionItem[]>([])
  
  // 加载状态
  const loading = ref(false)
  
  // 错误信息
  const error = ref('')

  /**
   * 获取后端菜单数据
   */
  const fetchMenus = async (parentId: number = 0) => {
    const userStore = useStore()
    
    // 如果用户未登录，不加载菜单
    if (!userStore.userinfo.usertoken) {
      return
    }
    
    // 开始加载，重置错误
    loading.value = true
    error.value = ''
    
    try {
      // 调用API获取完整菜单数据
      const response = await getMenuPermission(parentId) as any
      
      // 验证响应有效性并处理数据
      if (response && response.IsSuc && response.Data && response.Data.length > 0) {
        // 更新菜单列表 - 存储完整的菜单树
        menuList.value = response.Data
        console.log('从后端获取的完整菜单数据:', menuList.value)
        
        // 根据用户角色和路由配置过滤菜单
        filterMenusByRouteRoles()
      } else {
        // 菜单数据为空
        console.warn('后端返回的菜单数据为空或无效')
        menuList.value = []
        
        // 记录错误信息
        if (response && !response.IsSuc) {
          error.value = response.Msg || '获取菜单失败'
          console.error('获取菜单失败:', response)
        }
      }
    } catch (err: any) {
      // 捕获并处理异常
      error.value = err.message || '获取菜单出错'
      console.error('获取菜单出错:', err)
      menuList.value = []
    } finally {
      // 无论成功或失败，最终都要结束加载状态
      loading.value = false
    }
  }
  
  /**
   * 根据路由的roles属性过滤菜单
   * 如果用户角色包含在路由的roles中，则显示该菜单
   */
  const filterMenusByRouteRoles = () => {
    const userStore = useStore()
    const userRoleId = userStore.userinfo.role || 0
    
    // 管理员角色(1或2)可以查看所有菜单
    if ([1, 2].includes(Number(userRoleId))) {
      return // 管理员不需要过滤，直接返回完整菜单
    }
    
    // 获取所有路由配置
    const routes = router.getRoutes()
    
    /**
     * 递归过滤菜单
     * 根据菜单的Pagepath属性找到对应的路由，然后检查用户角色是否在路由的roles中
     */
    const filterMenus = (menus: MenuPermissionItem[]): MenuPermissionItem[] => {
      return menus.filter(menu => {
        // 获取该菜单对应的路由
        const matchedRoute = menu.Pagepath ? 
          routes.find(route => route.path === menu.Pagepath || 
                            `${route.path}` === `${menu.Pagepath}`) : 
          null
        
        // 如果菜单有子菜单，递归过滤子菜单
        if (menu.Children && menu.Children.length > 0) {
          menu.Children = filterMenus(menu.Children)
          
          // 菜单剪枝：如果过滤后没有子菜单，且当前菜单没有页面路径，则移除该菜单
          if (menu.Children.length === 0 && !menu.Pagepath) {
            return false
          }
          
          // 如果有子菜单，则显示该菜单
          if (menu.Children.length > 0) {
            return true
          }
        }
        
        // 如果没有找到对应的路由，默认显示该菜单
        if (!matchedRoute || !matchedRoute.meta || !matchedRoute.meta.roles) {
          return true
        }
        
        // 检查用户角色是否在路由的roles中
        const routeRoles = matchedRoute.meta.roles as number[]
        return routeRoles.includes(Number(userRoleId))
      })
    }
    
    // 应用过滤器到整个菜单树
    menuList.value = filterMenus(menuList.value)
  }
  
  /**
   * 通过路径查找菜单项
   */
  const findMenuByPath = (path: string): MenuPermissionItem | null => {
    const findInMenus = (menus: MenuPermissionItem[], targetPath: string): MenuPermissionItem | null => {
      for (const menu of menus) {
        if (menu.Pagepath === targetPath) {
          return menu
        }
        
        if (menu.Children && menu.Children.length > 0) {
          const found = findInMenus(menu.Children, targetPath)
          if (found) {
            return found
          }
        }
      }
      return null
    }
    
    return findInMenus(menuList.value, path)
  }
  
  // 返回状态和方法
  return {
    menuList,
    loading,
    error,
    fetchMenus,
    findMenuByPath
  }
}, {
  persist: true // 简化的持久化配置
}) 